<!DOCTYPE html>
<html>
  <head>
	<meta charset="utf-8">
    <title>jquery calendar grid date-picker tab and more plugin</title>
    <link rel="stylesheet" href="css/style.css" type="text/css" media="all">
    <link rel="stylesheet" href="css/print.css" type="text/css" media="print">
    <script type="text/javascript" src="css/dbx.js"></script>
    <script type="text/javascript" src="css/dbx-key.js"></script>
    <link rel="stylesheet" type="text/css" href="css/dbx.css"  media="screen, projection">
    
    <!--code highlighter file import-->
    <script src="../../highlighter/scripts/shCore.js" type="text/javascript"></script>
    <script src="../../highlighter/scripts/shBrushJScript.js" type="text/javascript"></script>
    <script src="../../highlighter/scripts/shBrushCss.js" type="text/javascript"></script>  
    <link href="../../highlighter/styles/shCore.css" rel="stylesheet" type="text/css" />
    <link href="../../highlighter/styles/shThemeDefault.css" rel="stylesheet" type="text/css" /> 
    <script type="text/javascript">
        SyntaxHighlighter.config.clipboardSwf = '../../highlighter/scripts/clipboard.swf';
    	  SyntaxHighlighter.all();
	  </script>
    <!--end code highlighter-->
    
    <link rel="stylesheet" href="css/shared.css" type="text/css">
  </head>
  <body>
    <div id="page" class="fix">	
      <div id="wrapper" class="fix">	   
        <div id="header" class="fix">							
          <a href="http://www.web-delicious.com/">
            <img class="headerimage"  src="css/iblog2.png" alt="jquery plugins"></a>				   
        </div>
        <!-- /header -->	
        <div id="nav" class="fix">		
          <ul class="fix">			
<li class="page_item "><a class="home" href="http://www.web-delicious.com/" title="Home"><img width="18" height="18" class="homeimage" src="http://www.web-delicious.com/wp-content/themes/iblog2/images/home-icon-trans.png" alt="" /></a></li>
<li class="page_item page-item-15"><a href="http://www.web-delicious.com/jquery-plugins/" title="JQuery Plugins">JQuery Plugins</a></li>
<li class="page_item page-item-12"><a href="http://www.web-delicious.com/outsourcing/" title="Outsourcing">Outsourcing</a></li>
<li class="page_item page-item-48"><a href="http://www.web-delicious.com/portfolio/" title="Portfolio">Portfolio</a></li>
<li class="page_item page-item-69"><a href="http://www.web-delicious.com/about-us/" title="About us">About us</a></li>			
          </ul>		 		 	
        </div>
       <!-- /nav -->
       <div id="container" class="fix">    
          <div id="left-col">      
            <div id="content">
<div class="content">
  <a name="config"></a><h2>Config</h2>
<table class="items-list"><tr><td><a href="index.html#config_active">active</a></td><td><a href="index.html#config_autoresizable">autoResizable</a></td><td><a href="index.html#config_border">border</a></td><td><a href="index.html#config_height">height</a></td><tr><td><a href="index.html#config_heightresizable">heightResizable</a></td><td><a href="index.html#config_items">items</a></td><td><a href="index.html#config_renderto">renderTo</a></td><td><a href="index.html#config_width">width</a></td><tr><td><a href="index.html#config_widthresizable">widthResizable</a></td></table>  <div class="list">
    <a name="config_active"></a> 
    <h3>active</h3>
    <p class="padded"><span class="datatype">Number</span> &nbsp; Active tab index. Base on 0.</p>
    <a name="config_autoresizable"></a> 
    <h3>autoResizable</h3>
    <p class="padded"><span class="datatype">Boolean</span> &nbsp; Whether panel resizes itself according to content.</p>
    <a name="config_border"></a> 
    <h3>border</h3>
    <p class="padded"><span class="datatype">Boolean</span> &nbsp; To show border or not.</p>
    <a name="config_height"></a> 
    <h3>height</h3>
    <p class="padded"><span class="datatype">String</span> &nbsp; Initialization height.</p>
    <pre class="brush:js;">//heigh config
 height : '200px'// or '100%'.</pre>
    <a name="config_heightresizable"></a> 
    <h3>heightResizable</h3>
    <p class="padded"><span class="datatype">Booean</span> &nbsp; Whether end user can change panel height by mouse dragging.</p>
    <a name="config_items"></a> 
    <h3>items</h3>
    <p class="padded"><span class="datatype">Array</span> &nbsp; Tab items array.</p>
    <a name="config_renderto"></a> 
    <h3>renderTo</h3>
    <p class="padded"><span class="datatype">String or JQuery object</span> &nbsp; To specify where tab panel will be placed. It could be a DOM id or jquery object.</p>
    <a name="config_width"></a> 
    <h3>width</h3>
    <p class="padded"><span class="datatype">String</span> &nbsp; Initialization width.</p>
    <pre class="brush:js;">// width config, in px or percentage.
 width : '200px'// or '100%'.</pre>
    <a name="config_widthresizable"></a> 
    <h3>widthResizable</h3>
    <p class="padded"><span class="datatype">Boolean</span> &nbsp; Whether end user can change panel width by mouse dragging.</p>
  </div>
  <a name="method"></a><h2>Method</h2>
<table class="items-list"><tr><td><a href="index.html#addtab">addTab</a></td><td><a href="index.html#getactiveindex">getActiveIndex</a></td><td><a href="index.html#getactivetab">getActiveTab</a></td><td><a href="index.html#getclosable">getClosable</a></td><tr><td><a href="index.html#getcontent">getContent</a></td><td><a href="index.html#getdisable">getDisable</a></td><td><a href="index.html#gettabposision">getTabPosision</a></td><td><a href="index.html#gettabscount">getTabsCount</a></td><tr><td><a href="index.html#gettitle">getTitle</a></td><td><a href="index.html#kill">kill</a></td><td><a href="index.html#refresh">refresh</a></td><td><a href="index.html#setclosable">setClosable</a></td><tr><td><a href="index.html#setcontent">setContent</a></td><td><a href="index.html#setdisable">setDisable</a></td><td><a href="index.html#setrenderwh">setRenderWH</a></td><td><a href="index.html#settitle">setTitle</a></td></table>  <div class="list">
    <a name="addtab"></a> 
      <h3>addTab(item)</h3>
      <p class="padded"> To add a new tab.</p>
      <p class="padded"><table cellspacing="3" width="90%" class="parameter-table"><tr><td width="10%"><i>Object</i></td><td width="10%"><b>item</b></td><td width="80%"> Object for item profile.</td></tr></table></p>
     <pre class="brush:js;">//to add a new tab
 addTab({id:"newtabid",
    title:"I am new" ,
    html:"some new message goes here",
    closable: true,
    disabled:false,
    icon:"image/new.gif"
 });</pre>
    <a name="getactiveindex"></a> 
      <h3>getActiveIndex()</h3>
      <p class="padded"> To get index of active tab.</p>
      <p class="padded">Return <span class="datatype">Number</span> - index of active tab.</p>
      <p class="padded"><table cellspacing="3" width="90%" class="parameter-table"></table></p>
    <a name="getactivetab"></a> 
      <h3>getActiveTab()</h3>
      <p class="padded"> To get active tab.</p>
      <p class="padded">Return <span class="datatype">Object</span> - Profile of active tab.</p>
      <p class="padded"><table cellspacing="3" width="90%" class="parameter-table"></table></p>
    <a name="getclosable"></a> 
      <h3>getClosable(id)</h3>
      <p class="padded"> To determine whether tab is closable or not.</p>
      <p class="padded"><table cellspacing="3" width="90%" class="parameter-table"><tr><td width="10%"><i>String</i></td><td width="10%"><b>id</b></td><td width="80%"> item id.</td></tr></table></p>
    <a name="getcontent"></a> 
      <h3>getContent(id)</h3>
      <p class="padded"> To get tab inner html.</p>
      <p class="padded"><table cellspacing="3" width="90%" class="parameter-table"><tr><td width="10%"><i>String</i></td><td width="10%"><b>id</b></td><td width="80%"> item id.</td></tr></table></p>
    <a name="getdisable"></a> 
      <h3>getDisable(id)</h3>
      <p class="padded"> To determine whether tab is disabled or not.</p>
      <p class="padded"><table cellspacing="3" width="90%" class="parameter-table"><tr><td width="10%"><i>String</i></td><td width="10%"><b>id</b></td><td width="80%"> item id.</td></tr></table></p>
    <a name="gettabposision"></a> 
      <h3>getTabPosision(id)</h3>
      <p class="padded"> To get tab index.</p>
      <p class="padded">Return <span class="datatype">Number</span> - index of tab.</p>
      <p class="padded"><table cellspacing="3" width="90%" class="parameter-table"><tr><td width="10%"><i>String</i></td><td width="10%"><b>id</b></td><td width="80%"> item id.</td></tr></table></p>
    <a name="gettabscount"></a> 
      <h3>getTabsCount()</h3>
      <p class="padded"> To get how many tabs are in the panel.</p>
      <p class="padded">Return <span class="datatype">Number</span> - Number of tabs .</p>
      <p class="padded"><table cellspacing="3" width="90%" class="parameter-table"></table></p>
    <a name="gettitle"></a> 
      <h3>getTitle(id)</h3>
      <p class="padded"> To get tab title.</p>
      <p class="padded"><table cellspacing="3" width="90%" class="parameter-table"><tr><td width="10%"><i>String</i></td><td width="10%"><b>id</b></td><td width="80%"> item id.</td></tr></table></p>
    <a name="kill"></a> 
      <h3>kill(id)</h3>
      <p class="padded"> To close tab.</p>
      <p class="padded"><table cellspacing="3" width="90%" class="parameter-table"><tr><td width="10%"><i>String</i></td><td width="10%"><b>id</b></td><td width="80%"> item id.</td></tr></table></p>
    <a name="refresh"></a> 
      <h3>refresh(id)</h3>
      <p class="padded"> To refresh tab content.</p>
      <p class="padded"><table cellspacing="3" width="90%" class="parameter-table"><tr><td width="10%"><i>String</i></td><td width="10%"><b>id</b></td><td width="80%"> item id.</td></tr></table></p>
    <a name="setclosable"></a> 
      <h3>setClosable(id,&nbsp True)</h3>
      <p class="padded"> To enable or disable end user to close tab.</p>
      <p class="padded"><table cellspacing="3" width="90%" class="parameter-table"><tr><td width="10%"><i>String</i></td><td width="10%"><b>id</b></td><td width="80%"> Item id.</td></tr><tr><td width="10%"><i>Booleaan</i></td><td width="10%"><b>True</b></td><td width="80%"> for closable, false for not.</td></tr></table></p>
    <a name="setcontent"></a> 
      <h3>setContent(id,&nbsp title)</h3>
      <p class="padded"> To set tab title.</p>
      <p class="padded"><table cellspacing="3" width="90%" class="parameter-table"><tr><td width="10%"><i>String</i></td><td width="10%"><b>id</b></td><td width="80%"> Item id.</td></tr><tr><td width="10%"><i>String</i></td><td width="10%"><b>title</b></td><td width="80%"> Tab inner html.</td></tr></table></p>
    <a name="setdisable"></a> 
      <h3>setDisable(id,&nbsp True)</h3>
      <p class="padded"> To enable or disable tab.</p>
      <p class="padded"><table cellspacing="3" width="90%" class="parameter-table"><tr><td width="10%"><i>String</i></td><td width="10%"><b>id</b></td><td width="80%"> Item id.</td></tr><tr><td width="10%"><i>Booleaan</i></td><td width="10%"><b>True</b></td><td width="80%"> for disabled, false for enabled.</td></tr></table></p>
    <a name="setrenderwh"></a> 
      <h3>setRenderWH(wh)</h3>
      <p class="padded"> To set width and height of the panel.</p>
      <p class="padded"><table cellspacing="3" width="90%" class="parameter-table"><tr><td width="10%"><i>Object</i></td><td width="10%"><b>wh</b></td><td width="80%"> width and height.</td></tr></table></p>
     <pre class="brush:js;">//To set tab height and width
 setRenderWH({width:'200px', height:'400px'});</pre>
    <a name="settitle"></a> 
      <h3>setTitle(id,&nbsp title)</h3>
      <p class="padded"> To set tab title.</p>
      <p class="padded"><table cellspacing="3" width="90%" class="parameter-table"><tr><td width="10%"><i>String</i></td><td width="10%"><b>id</b></td><td width="80%"> Item id.</td></tr><tr><td width="10%"><i>String</i></td><td width="10%"><b>title</b></td><td width="80%"> Tab title.</td></tr></table></p>
  </div>
</div>

			         

              <div class="page-nav fix"> 
                <span class="previous-entries">
                </span> 
                <span class="next-entries">
                </span>
              </div>
              <!-- page nav -->		
            </div>				 		
          </div> 
          <!-- end leftcol -->		
          <div style="position: relative; display: block;" class="dbx-group"  id="sidebar">	 		
            <div id="cred">				
              <a class="plimage" href="http://www.pagelines.com/">Free WordPress  Themes</a>		
            </div>
               
            <div style="clear: both;">
            </div>
            
            <div style="position: relative; display: block;" id="links"  class="dbx-box dbx-box-open dbxid3">        
              <h3 title="click-down and drag to move this box"  style="position: relative; display: block;" class="dbx-handle  dbx-handle-cursor">API
                <a title="click to close this box"  class="dbx-toggle dbx-toggle-open" href="javascript:void(null)"  style="cursor: pointer;">&nbsp;</a></h3>        
                <div class="dbx-content">          

<div class="index">
<ul>
<li class="class"><a href="index.html">TabPanel</a>
  <ul>
    <li class="group"><a href="index.html#config">Config</a>
      <ul>
        <li class="config"><a href="index.html#config_active">active</a></li>
        <li class="config"><a href="index.html#config_autoresizable">autoResizable</a></li>
        <li class="config"><a href="index.html#config_border">border</a></li>
        <li class="config"><a href="index.html#config_height">height</a></li>
        <li class="config"><a href="index.html#config_heightresizable">heightResizable</a></li>
        <li class="config"><a href="index.html#config_items">items</a></li>
        <li class="config"><a href="index.html#config_renderto">renderTo</a></li>
        <li class="config"><a href="index.html#config_width">width</a></li>
        <li class="config"><a href="index.html#config_widthresizable">widthResizable</a></li>
      </ul>
    </li>
    <li class="group"><a href="index.html#method">Method</a>
      <ul>
        <li class="config"><a href="index.html#addtab">addTab</a></li>
        <li class="config"><a href="index.html#getactiveindex">getActiveIndex</a></li>
        <li class="config"><a href="index.html#getactivetab">getActiveTab</a></li>
        <li class="config"><a href="index.html#getclosable">getClosable</a></li>
        <li class="config"><a href="index.html#getcontent">getContent</a></li>
        <li class="config"><a href="index.html#getdisable">getDisable</a></li>
        <li class="config"><a href="index.html#gettabposision">getTabPosision</a></li>
        <li class="config"><a href="index.html#gettabscount">getTabsCount</a></li>
        <li class="config"><a href="index.html#gettitle">getTitle</a></li>
        <li class="config"><a href="index.html#kill">kill</a></li>
        <li class="config"><a href="index.html#refresh">refresh</a></li>
        <li class="config"><a href="index.html#setclosable">setClosable</a></li>
        <li class="config"><a href="index.html#setcontent">setContent</a></li>
        <li class="config"><a href="index.html#setdisable">setDisable</a></li>
        <li class="config"><a href="index.html#setrenderwh">setRenderWH</a></li>
        <li class="config"><a href="index.html#settitle">setTitle</a></li>
      </ul>
    </li>
  </ul>
</li>
</ul>
</div>
              </div>
            </div>
            <span style="display: block; width: 0pt; height: 0pt;  overflow: hidden;" class="dbx-box dbx-dummy dbx-offdummy">
            </span>
          </div>
          <!--/sidebar -->				 		
        </div> 
        <!-- /container -->	
      </div> 
      <!-- /wrapper -->    
      <hr class="hidden">  
    </div>
    
  </body>
</html>
